.root {
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #FFD2A5, #FBEBD1);
    overflow: hidden;

    .seaWaveBox {
        width: 932px;
        height: 510px;
        position: relative;
        z-index: 99;
    }

    .seaWave {
        width: 336.5px;
        height: 326.5px;
        animation: seaWave 3s infinite alternate;
    }

    .spray {
        width: 925px;
        height: 548px;
        position: absolute;
        left: 0;
        animation: spray 3s infinite alternate;
    }

    .jiaoBox {
        position: absolute;
        left: 0;
        right: 0;
        height: 100%;
        z-index: 88;

        .jiaoBoxSom {
            width: 100%;
            height: 100%;
            position: relative;

            .jiao1 {
                position: absolute;
                left: 200px;
                bottom: 0;
            }

            .jiao2 {
                position: absolute;
                left: 350px;
                bottom: 0;
            }

            .jiao3 {
                position: absolute;
                left: 350px;
                bottom: 200px;
            }

            .jiao4 {
                position: absolute;
                left: 586px;
                bottom: 300px;
            }

            .starfish {
                position: absolute;
                left: 100px;
                bottom: 250px;
            }

            .shell {
                position: absolute;
                left: 260px;
                bottom: 450px;
            }
        }
    }

    :global {
        .login_form {
            width: 600px;
            border-radius: 10px;
            box-shadow: 0 0 30px 0px #001529;
            padding: 20px;
            box-sizing: border-box;
            position: absolute;
            right: 0;
            height: 100%;
            border-radius: 0;
            background-color: #fff;
            z-index: 999;
        }

        .login_log {
            font-size: 36px;
            font-family: fantasy;
            text-align: center;
        }
    }

    @keyframes seaWave {
        0% {
            width: 300px;
        }

        100% {
            width: 336.5;
        }
    }

    @keyframes spray {
        0% {
            width: 825px;
        }

        100% {
            width: 925px;
        }
    }
}